<template>
	<elestatement :pop='pop'
      v-loading="loading"
      :element-loading-text="loadingText"
      element-loading-spinner="el-icon-warning-outline"
      element-loading-background="rgba(0, 0, 0, 0.6)">
    <slot slot="close"></slot>
    <div class="condiv" slot="content">
      <div style="width:100%;height:100%" class="echarts2or2" :id="id"></div>
    </div>
   
  </elestatement>
</template>
<style lang="scss">
.element2x2{
  .condiv{
    width:560px;
    height:300px;
    overflow: hidden;
    .echarts2or2{
      width: 100%;
      height:100%;
    }
  }
}

</style>
<script>
let echarts = require("echarts");
let moment = require("moment");
import elestatement from "@/components/real-time/real-time-module/common/size/Element2x2";
export default {
   props: {
    	pop:{
    		default:function(){
    			return {
    				title: "客流销售分析",							//报表标题
    				helphint:[
    						{title:"客流销售分析",text:""},				//第一条信息为提示标题 不给text
    						{title:"进入人数",text:"：选择的日期跨度内进店总人数"},
    						{title:"销售金额",text:"：选择的日期跨度内销售总额"},
    				]
    			}
    		}
      },
      option:{},
      loading:'',
      loadingText:'',
  },
  components: {
      elestatement:elestatement
  },
  data(){
    return {
      myChart:null,
      id:"echart"+new Date().getTime()+Math.random()*10000,
      
    }
  },
  created() {},
  mounted() {
    this.myChart = echarts.init(document.getElementById(this.id));
    this.$Bus.$on('WinResize', () => {
      this.myChart.resize();
    });
  },
  beforeDestroy()
  {
     this.$Bus.$off('WinResize');
  },
  methods: {
   
   setOption(iskong=false){
     if(iskong)
     {
       this.myChart.setOption({},true);
     }
     else{
        this.myChart.setOption(this.option,true);
     }
   },
   
  },
  watch: {
   
  },

};
</script>
